﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>IntelliFlex Cloud Server大数据云监控系统</title>

    <link href="~/Content/bootstrap.min.css" rel="stylesheet">
    <link href="~/Fonts/font-awesome/css/font-awesome.css" rel="stylesheet">

    <link href="~/Content/animate.css" rel="stylesheet">
    <link href="~/Content/style.css" rel="stylesheet">

    <script src="~/Scripts/jquery-2.2.3.min.js"></script>
        <style type="text/css">
            .banner-show {
                position: absolute;
                top: 0;
                left: 0;
                z-index: 0;
                width: 100%;
                min-width: 980px;
                height: 100%;
                overflow: hidden;
            }

                .banner-show .cell {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    overflow: hidden;
                    background-repeat: repeat-x;
                    background-position: center top;
                }

                    .banner-show .cell .con {
                        position: relative;
                        height: 100%;
                        background-repeat: no-repeat;
                        background-position: center top;
                    }

            /*.bns-01 {
            background-image: url('../../Images/loginimage/banner_01_repeat.png');
        }*/

            .bns-01 .con {
                background-image: url(../../Images/loginimage/desert.jpg);
                background-size: 100% 100%;
            }

            /*.bns-02 {
            background-image: url(../../Images/loginimage/banner_02_repeat.gif);
        }*/

            .bns-02 .con {
                background-image: url(../../Images/loginimage/snow.jpg);
                background-size: 100% 100%;
            }

            /*.bns-03 {
            background-image: url(../../Images/loginimage/banner_03_repeat.png);
        }

            .bns-03 .con {
                background-image: url(../../Images/loginimage/banner_03.png);
            }*/
            }
            .valid-form {
                font-size: 14px;
                width: 60%;
                background-color: #ffffff;
                border: 1px solid #e5e6e7;
                border-radius: 1px;
                padding: 6px 12px;
            }
            /*.banner-control {
            position: absolute;
            top: 0;
            left: 50%;
            width: 980px;
            margin-left: -490px;
        }

            .banner-control a {
                position: absolute;
                top: 258px;
                width: 30px;
                height: 30px;
                line-height: 10;
                overflow: hidden;
                background-image: url(../../Images/loginimage/icon_control.png);
                background-repeat: no-repeat;
                background-repeat: no-repeat;
            }

                .banner-control a.left {
                    left: -55px;
                    background-position: 0 0;
                }

                    .banner-control a.left:hover {
                        background-position: 0 -30px;
                    }

                .banner-control a.right {
                    right: -55px;
                    background-position: -30px 0;
                }

                    .banner-control a.right:hover {
                        background-position: -30px -30px;
                    }*/
        </style>
    </head>

    <body class="full-height-layout gray-bg">
        <div class="banner-show" id="js_ban_content">
            <div class="cell bns-01">
                <div class="con"></div>
            </div>
            <div class="cell bns-02" style="display:none;">
                <div class="con"></div>
            </div>
            @*<div class="cell bns-03" style="display:none;">
                    <div class="con"></div>
                </div>*@
        </div>
        <div id="wrapper">
            @*<div class="banner-control" id="js_ban_button_box"> <a href="javascript:;" class="left">左</a> <a href="javascript:;" class="right">右</a> </div>*@
            <div class="xds-no-breadcrumb">
                <div class="full-height">
                    <div class="full-height-scroll">
                        <div class="loginColumns animated fadeInDown" style="padding:40px">
                            <div class="row">
                                <div class="col-md-offset-2 col-md-8 text-center">
                                    <div style="height:10%; width:100%;">
                                        <img style="width:80%;height:80%" src="~/Images/logoimage/logo_b_w.png" />
                                    </div>
                                    <h1><font color="white">IntelliFlex Cloud Server大数据云监控系统</font></h1>
                                    <h4><font color="white">IntelliFlex Vertical Pumping Unit</font></h4>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-offset-2 col-md-8">
                                    <div class="ibox-content" style="margin-bottom:10px">
                                        @using (Html.BeginForm("Index", "Login", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "m-t", role = "form" }))
                                        {
                                            <div class="form-group">
                                                <input type="email" id="name" name="Username" class="form-control" placeholder="用户名" required="">
                                            </div>
                                            <div class="form-group">
                                                <input type="password" id="password" name="Password" class="form-control" placeholder="密码" required="">
                                            </div>
                                            <div class="form-group" style="margin-bottom:auto">
                                                <input type="text" id="validate" name="Validate" class="valid-form" placeholder="验证码" required="">
                                                <img id="valiCode" style="cursor: pointer;padding-bottom:3px" src="../Login/GetValidateCode" alt="验证码" />
                                                <a id="valiCodeA">看不清？  换一张</a>
                                                <b style="color:Window">&nbsp;&nbsp;&nbsp;</b>
                                                <b style="color:red;">@Request.Params["message"]</b>
                                            </div>
                                            @*<div class="form-group">
                                                    <input type="text" id="phonevalid" name="PhoneValid" class="valid-form" placeholder="短信验证码" required="">
                                                    <button type="button" onclick="validMessage()" style="width:35%" class="btn btn-primary">获取短信验证码</button>
                                                </div>*@

                                            <button type="submit" onclick="" class="btn btn-primary block full-width m-b">登录</button>
                                            <a href="#" style="display:block;padding-bottom:5px">
                                                <small>忘记密码?</small>
                                            </a>
                                            <a href="#" style="display:block;padding:5px 0">
                                                <small>还没有授权账号?</small>
                                            </a>
                                            <a class="btn btn-sm btn-white btn-block" href="register.html">注册账号</a>
                                        }
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @*<div class="row" style="bottom:0px;height:50px;position:relative;">
                    <div class="col-md-offset-3 col-md-6 text-center">
                        <h5>版权所有山东IntelliFlex Cloud Server技术有限公司</h5>
                    </div>
                </div>*@
            <div class="footer">
                <div class="row">
                    <div class="col-md-offset-3 col-md-6 text-center">
                        版权所有 山东IntelliFlex Cloud Server技术有限公司© 2017
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>
    <script type="text/javascript">
        ; (function () {
            $("#valiCode").bind("click", function () {
                this.src = "../Login/GetValidateCode?time=" + (new Date()).getTime();
            });
            $("#valiCodeA").bind("click", function () {
                $("#valiCode").attr('src', "../Login/GetValidateCode?time=" + (new Date()).getTime());
            });
            var defaultInd = 0;
            var list = $('#js_ban_content').children();
            var count = 0;
            var change = function (newInd, callback) {
                if (count) return;
                count = 2;
                $(list[defaultInd]).fadeOut(400, function () {
                    count--;
                    if (count <= 0) {
                        if (start.timer) window.clearTimeout(start.timer);
                        callback && callback();
                    }
                });
                $(list[newInd]).fadeIn(400, function () {
                    defaultInd = newInd;
                    count--;
                    if (count <= 0) {
                        if (start.timer) window.clearTimeout(start.timer);
                        callback && callback();
                    }
                });
            }

            var next = function (callback) {
                var newInd = defaultInd + 1;
                if (newInd >= list.length) {
                    newInd = 0;
                }
                change(newInd, callback);
            }

            var start = function () {
                if (start.timer) window.clearTimeout(start.timer);
                start.timer = window.setTimeout(function () {
                    next(function () {
                        start();
                    });
                }, 8000);
            }

            start();

            //$('#js_ban_button_box').on('click', 'a', function () {
            //    var btn = $(this);
            //    if (btn.hasClass('right')) {
            //        //next
            //        next(function () {
            //            start();
            //        });
            //    }
            //    else {
            //        //prev
            //        var newInd = defaultInd - 1;
            //        if (newInd < 0) {
            //            newInd = list.length - 1;
            //        }
            //        change(newInd, function () {
            //            start();
            //        });
            //    }
            //    return false;
            //});

        })();
        function validMessage() {
            swal({
                title: "Welcome in Alerts!",
                text: "Verify that the message has been sent to 156XXXX6035, please check."
            });
        }
    </script>